<!--
 * @Description: 
 * @Author: charles
 * @Date: 2021-05-05 22:02:56
 * @LastEditors: lk
 * @LastEditTime: 2022-01-10 23:34:30
-->
<template>
  <div ref="right2_container" style="height: 95%"></div>
</template>
<script>
import { Pie } from '@antv/g2plot';
export default{
mounted(){
 this.initChat();
},
methods:{
   initChat(){
  const data = [
  { type: '旅游', value: 25 },
  { type: '就医', value: 19 },
  { type: '工作', value: 17 },
  { type: '探亲', value: 7 },
  { type: '归家', value: 12 },
  { type: '其他目的', value: 20 },
];

const piePlot = new Pie(this.$refs.right2_container, {
  appendPadding: 10,
  data,
  angleField: 'value',
  colorField: 'type',
  radius: 0.8,
  label: {
    type: 'outer',
    content: '{name} {percentage}',
  },
  interactions: [{ type: 'pie-legend-active' }, { type: 'element-active' }],
});

piePlot.render();
}
}
}
</script>